import {photos} from "@/app/data";
import Image from "next/image";

export default function Page({params}: { params: { id: string } }) {
    const photo = photos.find(item => item.id === +params.id)!
    return (
        <div className={"container mx-auto pt-8"}>
            <Image src={photo.src} alt={photo.alt} width={400} height={400}
                   className={"rounded-lg block mx-auto"}></Image>
            <div className={"border-2 border-dashed border-grey-500 rounded-lg p-3 mt-6 leading-8"}>
                <p>
                    <strong>Title:</strong> {photo.alt}
                </p>
                <p>
                    <strong>Price:</strong> {photo.price}
                </p>
                <p>
                    <strong>Desc:</strong> Lorem ipsum dolor sit amet, consectetur adipisicing elit. Amet ea incidunt
                    molestiae nisi quidem quod repellendus repudiandae sit ut vel! Consequuntur esse fugit ipsa nesciunt
                    odio quia quibusdam quo voluptatibus? Lorem ipsum dolor sit amet, consectetur adipisicing elit.
                    Beatae debitis delectus dolor hic itaque molestiae molestias obcaecati placeat quos vitae! Ea
                    excepturi facilis itaque modi numquam quasi sint tenetur totam!lorem ipsum lorem ipsum
                </p>
            </div>
        </div>
    )
}
